<template>
    <div class="brandInfoContainer">
        <div class="infolist">
          <div class="headerSection">
            <split-vertical title="品牌信息"></split-vertical>
            <v-form :formProps="searchForm" ref="form"
                    v-on:handleReset="handleReset"
                    v-on:coverFormData="coverFormData">
            </v-form>
          </div>
          <div class="stand">
            <div style="line-height:50px;margin-left:10px;">
              <v-button :operationBtnArray="operationBtnArray" v-on:handleSearchTopBtn="handleSearchTopBtn"></v-button>
            </div>
            <div style="margin:0 10px;">
              <v-table :tableParams="tableParams" v-on:handleOperation="handleOperation"></v-table>
            </div>
          </div>
          <div class="block">
              <el-pagination
                  @current-change="handleCurrentChange"
                  :current-page="pageIndex"
                  :page-sizes="[10]"
                  :page-size="10"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="pageCount">
              </el-pagination>
          </div>
            <!-- 弹出框组件 -->
            <edit-info v-if="show" @closeDialog='closeDialog' :addinfo='addinfo'></edit-info>
            <add-info v-if='showtip' @closeDialog='closeDialog'></add-info>
            <brand-count v-if='isShowCount' @closeDialog='closeDialog'></brand-count>
        </div>
    </div>
</template>

<script>

import VTable from "components/common/PageTable/VTable"
import addInfo from 'components/base/BrandInfo/AddInfo.vue'
import editInfo from 'components/base/BrandInfo/EditInfo.vue'
import brandCount from 'components/base/BrandInfo/BrandCount.vue'
import SplitVertical from "components/common/SplitVertical"
import VForm from "components/common/VForm"
import VButton from "components/common/VButton"
import {localStorage} from "../../../../../mobile/src/common/js/localStorage";
var accLevel={
    '1':'一级授权',
    '2':'二级授权'
}

export default {
    inject:['reload'],
    data(){
        return{
            show:false,
            isShowCount:false,
            addinfo:{},
            showtip:false,
            pageCount:0,
            pageIndex:1,
            pageSize:10,
            brandId:'',
            brandCode:'',
            accreditLevel:'',
            brandSelect:[],
            searchForm: {
            col: 3,
            labelWidth: '85px',
            submitBtn: {
              text: '搜索'
            },
            formItemArray: [{
              label: '授权品牌',
              prop: 'brandId',
              placeholder: "请选择",
              itemType: 'select',
              options: [],
              value: ''
            }, {
              label: '品牌编码',
              prop: 'brandCode',
              placeholder: "请输入",
              value: ''
            },{
              label: '授权级别',
              prop: 'accreditLevel',
              placeholder: "请选择",
              itemType: 'select',
              options:  [{
                value: '1',
                label: '一级授权'
              },
                {
                  value: '2',
                  label: '二级授权'
                }],
              value: ''
            }]
          },
          operationBtnArray: [{
            text: '刷新',
            show: true,
            icon:'el-icon-refresh',
            type: 'primary',
            methodName: 'refresh',
            }, {
              icon:'el-icon-plus',
              text: '新增',
              show: true,
              type: 'success',
              methodName: 'add',
            },
            {
              text: '品牌统计',
              icon:'el-icon-s-shop',
              show: true,
              type: 'warning',
              methodName: 'Statistics',
            }],
            tableParams:{
                dataArray:[],
                showMultiSelection:false,
                columnArray:[
                    {label: '授权品牌', prop: 'brandName',  sortable: false},
                    {label: '授权级别', prop: 'accreditLevel',  sortable: false},
                    {label: '渠道名称', prop: 'channelName',  sortable: false},
                    {label: '授权起止时间', prop: 'accreditStartTime',sortable: false},
                    {label: '授权结束时间', prop: 'accreditEndTime',sortable: false},
                    {label: '合作公司', prop: 'companyName',sortable: false},
                    {label: '录入人', prop: 'username',sortable: false}
                ],
                rowHandle:{
                    view:{
                        show:false
                    },
                    update:{
                        show:false
                    }
                }
            },
          searchCondition:{}
        }
    },
    created(){
      this.init()
    },
    methods:{
        init(){
           this.brandList()
           this.selectBrand()
        },
        handleSearchTopBtn(methodName) {
          if (methodName === "refresh") {
            this.refresh();
          } else if(methodName == "add"){
            this.create();
          }else{
            this.Statistics()
          }
        },
        handleReset(formName) {
          this.$refs.form.resetForm(formName);
        },
        coverFormData(data) {
          this.searchCondition = data;
          this.query()
        },
        handleOperation(rowIndex, row, methodName) {
            this.id=row.id
            if(methodName == "update"){
               this.showTip=true
               this.modifyBrandInfo()
            }else if(methodName == "delete"){
                this.delBrandInfo()
            }
        },
        modifyBrandInfo(){},
        delBrandInfo(){
            this.$confirm('是否删除该消息, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
            center: true
            }).then(() => {
                let parmas={
                    id:this.id
                }
                let success=data=>{
                    if(data.code=='OK'){
                        this.$message.success('删除成功')
                        this.brandList()
                    }else{
                        this.$message.error(data.msg)
                    }
                }
                this.api.brandDelete(parmas,success)
                }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
        },
        //选择品牌
        selectBrand(){
            let success=data=>{
                if(data.code=='OK'){
                  this.searchForm.formItemArray.forEach(item => {
                    if (item.prop === 'brandId') {
                      item.options = this.buildExceptKeyAndValue(data.data, "bname", "id", "label", "value");
                    }
                  })
                }else{
                    this.$message.error(data.msg)
                }
            }
            this.api.getBrandDetail({},success)
        },
        //初始化品牌信息接口，以及列表渲染
        brandList(){
            let parmas={
                page:{
                  pageIndex:this.pageIndex,
                  pageSize:this.pageSize
                }
            }
            let success=data=>{
                if(data.code=='OK'){
                    this.pageCount = data.pageCount
                    this.tableParams.dataArray= data.data
                    data.data.forEach(element => {
                        element.accreditLevel =accLevel[element.accreditLevel]
                        element.accreditStartTime=element.accreditStartTime.substr(0,10)
                        element.accreditEndTime=element.accreditEndTime.substr(0,10)
                    });
                }else{
                    this.$message.error(data.msg)
                }
            }
            this.api.newBrandList(parmas,success)
        },
        //刷新列表
        refresh(){
            this.brandList()
        },
        //品牌统计
        Statistics(){
            this.isShowCount=true
        },
        //查询
        query(){
              let param = this.searchCondition;
              if (!param.pageIndex || !param.pageSize) {
                param['pageIndex'] = this.pageIndex;
                param['pageSize'] = this.pageSize;
              }
              let success = data => {
                if (data.code === 'OK') {
                  this.pageCount = data.pageCount;
                  this.tableParams.dataArray=data.data
                  data.data.forEach(element => {
                    element.accreditLevel =accLevel[element.accreditLevel]
                    element.accreditStartTime=element.accreditStartTime.substr(0,10)
                    element.accreditEndTime=element.accreditEndTime.substr(0,10)
                  });
                } else {
                  this.$message.error(data.msg);
                }
              };
            this.api.brandListAll(param,success)
         },
        //弹框
        create(){
            this.showtip=true;
        },

        //关闭弹窗
        closeDialog(){
            this.showtip=false;
            this.show=false;
            this.isShowCount=false
        },
        //当前页
        handleCurrentChange(val) {
            this.searchCondition['pageIndex'] = val;
            this.query()
        }
    },
    components:{
        addInfo,VTable,brandCount,VForm, VButton, SplitVertical,editInfo
    }
}
</script>


<style lang="scss" scoped>
.brandInfoContainer{
    width: 100%;
    .headerSection{
      background:#fff;
      height:140px;
      padding:0 10px;
      border-left: 2px solid #e8e8e8;
      border-right: 2px solid #e8e8e8;
      border-bottom: 2px solid #e8e8e8;
    }
    .block{
        padding: 10px 0;
        text-align: right;
    }
}
</style>
